﻿<Controls:MetroWindow x:Class="MetroDemo.FlyoutDemo"
                      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                      xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
                      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                      Title="Flyouts Demo"
                      Width="800"
                      Height="600"
                      SaveWindowPosition="True"
                      WindowStartupLocation="CenterScreen"
                      BorderThickness="1"
                      mc:Ignorable="d">

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro.Resources;component/Icons.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/FlatButton.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>

    <Controls:MetroWindow.BorderBrush>
        <SolidColorBrush Color="{DynamicResource AccentColor}" />
    </Controls:MetroWindow.BorderBrush>

    <Controls:MetroWindow.Flyouts>
        <Controls:FlyoutsControl>
            <Controls:Flyout Header="settings" Position="Right">
                <Grid Margin="24">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Text="Something above the ScrollPanel" />

                    <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto">
                        <StackPanel Orientation="Vertical">
                            <TextBox Controls:TextboxHelper.Watermark="TextBox 01" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 02" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 03" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 04" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 05" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 06" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 07" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 08" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 09" />
                            <TextBox Margin="0,5,0,0" Controls:TextboxHelper.Watermark="TextBox 10" />
                        </StackPanel>
                    </ScrollViewer>

                    <StackPanel Grid.Row="2"
                            Margin="0,5,0,0"
                            Orientation="Horizontal">
                        <Button Margin="0,0,10,0" Content="create" />
                        <Button Content="cancel" />
                    </StackPanel>

                </Grid>
            </Controls:Flyout>

            <Controls:Flyout Header="new goodness" Position="Right">
                <StackPanel Orientation="Vertical">
                    <Button Content="create" />
                    <Button Content="cancel" />
                </StackPanel>
            </Controls:Flyout>

            <Controls:Flyout Header="third" Position="Right">
                <TextBlock Text="a third for testing" />
            </Controls:Flyout>

            <Controls:Flyout Header="settings" Position="Right">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>

                    <Label Grid.Row="0"
                       Grid.Column="0"
                       Margin="5"
                       VerticalAlignment="Center"
                       Content="Download language:" />
                    <ComboBox x:Name="flyoutSettingsComboboxDownloadlanguage"
                          Grid.Row="0"
                          Grid.Column="1"
                          Margin="0,5,5,5"
                          VerticalAlignment="Center" />

                    <Button x:Name="flyoutSettingsButtonSave"
                        Grid.Row="1"
                        Grid.Column="1"
                        Width="75"
                        Margin="5"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Bottom"
                        Content="Save" />
                </Grid>
            </Controls:Flyout>

            <Controls:Flyout Header="left" Position="Left">
                <StackPanel Width="150" Margin="5,5,5,5">
                    <TextBlock Text="a test for left" />
                    <CheckBox Content="a simple checkbox" />
                    <RadioButton Content="a simple RadioButton" />
                    <ComboBox>
                        <ComboBoxItem>Item 1</ComboBoxItem>
                        <ComboBoxItem>Item 2</ComboBoxItem>
                        <ComboBoxItem>Item 3</ComboBoxItem>
                    </ComboBox>
                </StackPanel>
            </Controls:Flyout>

            <Controls:Flyout Header="Top" Position="Top">
                <StackPanel Height="80"
                        Margin="5,5,5,5"
                        HorizontalAlignment="Right"
                        Orientation="Horizontal">
                    <Button Width="40"
                        Height="40"
                        FontFamily="Segoe UI Symbol"
                        FontSize="16"
                        Foreground="{DynamicResource FlyoutWhiteBrush}"
                        Style="{DynamicResource MetroCircleButtonStyle}">
                        <Rectangle Width="20" Height="20">
                            <Rectangle.Resources>
                                <SolidColorBrush x:Key="BlackBrush" Color="{DynamicResource FlyoutWhiteColor}" />
                            </Rectangle.Resources>
                            <Rectangle.Fill>
                                <VisualBrush Stretch="Fill" Visual="{StaticResource appbar_add}" />
                            </Rectangle.Fill>
                        </Rectangle>
                    </Button>
                </StackPanel>
            </Controls:Flyout>
            <Controls:Flyout Header="Bottom" Position="Bottom">
                <StackPanel Height="80"
                        Margin="5,5,5,5"
                        HorizontalAlignment="Right"
                        Orientation="Horizontal">
                    <Button Width="40"
                        Height="40"
                        FontFamily="Segoe UI Symbol"
                        FontSize="16"
                        Foreground="{DynamicResource FlyoutWhiteBrush}"
                        Style="{DynamicResource MetroCircleButtonStyle}">
                        <Rectangle Width="20" Height="20">
                            <Rectangle.Resources>
                                <SolidColorBrush x:Key="BlackBrush" Color="{DynamicResource FlyoutWhiteColor}" />
                            </Rectangle.Resources>
                            <Rectangle.Fill>
                                <VisualBrush Stretch="Fill" Visual="{StaticResource appbar_add}" />
                            </Rectangle.Fill>
                        </Rectangle>
                    </Button>
                </StackPanel>
            </Controls:Flyout>
        </Controls:FlyoutsControl>
    </Controls:MetroWindow.Flyouts>

    <Grid>
        <StackPanel Margin="10" HorizontalAlignment="Left">
            <TextBlock Margin="10"
                       FontSize="30"
                       Text="Some Flyout Tests..." />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowFirst"
                    Content="Show 1" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowSecond"
                    Content="Show 2" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowThird"
                    Content="Show 3" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowSettings"
                    Content="Settings" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="CloseMe"
                    Content="Close" />
        </StackPanel>

        <StackPanel Margin="10"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center">
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowTop"
                    Content="Show Top" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowBottom"
                    Content="Show Bottom" />
        </StackPanel>

        <StackPanel Margin="10" HorizontalAlignment="Right">
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowLeft"
                    Content="Show Left" />
        </StackPanel>
    </Grid>

</Controls:MetroWindow>
